<template>
    <section class="cms-body" v-loading="loading">
        <!-- 返回组件 -->
        <cms-back></cms-back>
        <el-form ref="form" :model="dataInfo" :rules="rules" class="cms-form" label-width="162px">

            <el-form-item label="类型名称" class="flex-50" prop="status">
                <el-input v-model="dataInfo.typeName" class="cms-width" :maxlength="20"></el-input>
            </el-form-item>

            <div class="form-footer">
                <el-button type="warning" v-if="this.id==0" @click="add(true)">保存并继续添加</el-button>
                <el-button type="primary" v-if="this.id==0" @click="add(false)">提交</el-button>
                <el-button type="primary" v-if="this.id!=0" @click="update()">修改</el-button>
                <el-button type="info" @click="$reset">重置</el-button>
                <span class="gray" v-if="this.id==0">
              选择“提交并继续添加”按钮会停留在添加页面；选择“提交”按钮后将跳转到对应的列表页</span>
            </div>
        </el-form>

    </section>
</template>

<script>
    import listMixins from '@/mixins/form';
    import axios from "axios";
    import va from "@/rules";

    export default {
        mixins: [listMixins],
        data() {
            let required = va.required();

            return {
                dataInfo: [],
                rules: {
                    //校验规则
                    typeName: [required],
                },
            };
        },
        methods: {
            getDataInfo(id) {
                if (id != 0) {
                    this.loading = true;
                    axios.post(this.$api.resourceTypeGet, {id: id}).then(res => {
                        this.loading = false;
                        if (res.code == '200') {
                            this.dataInfo = res.body;
                        }
                    }).catch(error => {
                        this.loading = false;
                    })
                } else {
                    this.loading = false;
                }
            },
            update() {
                this.updateDataInfo(this.$api.resourceTypeUpdate, this.dataInfo, "list");
            },
            add(state) {
                this.saveDataInfo(state, this.$api.resourceTypeSave, this.dataInfo, "list");
            },
        },
        created() {
            //初始获取数据
            this.getDataInfo(this.id);
        }
    };
</script>

<style>

</style>
